<script setup>
/**
 *小区列表通用子项组件
 */
const props = defineProps({
  schedule: { type: Object, required: true },
})
</script>
<template>
  <view class="entire">
    <view
      class="sign"
      :style="{
        backgroundColor: computed(() => {
          if (schedule.type == 0) {
            return '#de675e'
          }
          if (schedule.type == 1) {
            return '#f6e100'
          }
          if (schedule.type == 2) {
            return '#00a6ff'
          }
          return '#755ede'
        }),
      }"
    />
    <view class="content">
      <view class="text1">{{ schedule.title }}</view>
      <view class="text2">日程时间：{{ schedule.start }} 至 {{ schedule.end }}</view>
    </view>
  </view>
</template>

<style scoped lang="scss">
$uni-course-color: #de675e;
$uni-exam-color: #f6e100;
$uni-train-color: #00a6ff;
.entire {
  display: flex;
  width: 100%;
  min-height: 120rpx;
  padding-top: 10rpx;
  padding-bottom: 10rpx;
  background-color: #2d5996;
  border-bottom-color: #e2e2e4;
  border-bottom-style: solid;
  border-bottom-width: 1rpx;
  .sign {
    width: 10rpx;
    height: 100rpx;
    margin-left: 40rpx;
    border-radius: 5rpx;
  }
  .content {
    display: flex;
    flex-direction: column;
    min-height: 120rpx;
    margin-left: 30rpx;
    .text1 {
      margin-top: 6rpx;
    }
    .text2 {
      margin-top: 6rpx;
      font-size: 22rpx;
      color: #8c8c8c;
    }
  }
}
.entire {
  background-color: #ffffff;
}

.entire:active {
  background-color: #f5f5f7;
}
</style>
